<template>
  <div>
    <div class="bannerArea" :style="{background: 'url('+require('@/assets/banner.png')+') no-repeat center 0',backgroundSize: '100% 100%'}">
        <span style="position: absolute; left: 15%; top: 60px; color: #fcab37; font-size: 30px; font-weight: bolder"
          >技术库-热点技术</span
        >
        <span style="position: absolute; left: 15%; top: 100px; color: #fcab37; font-size: 20px"
          >TECHNICAL LIBRARY</span
        >
    </div>
    <a-card :bordered="false">
      <div class="table-operator"></div>
      <div class="container">
        <a-table
          ref="table"
          bordered
          size="middle"
          :rowKey="rowKey"
          :columns="columns"
          :dataSource="dataSource"
          :pagination="false"
          :loading="loading"
          :scroll="{ x: true }"
        >
        </a-table>
      </div>

      <!-- table区域-begin -->
    </a-card>
  </div>
</template>


<script>
import { getAction, postAction } from '@/api/manage'
import { strNotNull,getParamValFromUrl } from '@/utils/common.js'
import { JeecgListMixin } from '@/mixins/JeecgListSearchMixin'
export default {
  name: 'TechListHot',
  mixins: [JeecgListMixin],
  data() {
    return {
      description: '科技信息热点列表',
      /* 勾选导出参数 */
      rowKey: 'id',
      columns: [
        {
          title: '序号',
          dataIndex: '',
          key: 'rowIndex',
          width: 5,
          align: 'center',
          customRender: function (t, r, index) {
            return parseInt(index) + 1
          },
        },
        {
          title: '查阅次数',
          align: 'center',
          width: 80,
          dataIndex: 'visitsNum',
        },
        {
          title: '被引用次数',
          align: 'center',
          width: 100,
          dataIndex: 'timesNumber',
        },
        {
          title: '项目',
          align: 'center',
          width: 120,
          dataIndex: 'code',
        },
        {
          title: '技术编号',
          align: 'center',
          width: 150,
          dataIndex: 'fileNoShow',
        },
        {
          title: '技术名称(脱密)',
          align: 'center',
          width: 100,
          dataIndex: 'name',
        },
        {
          title: '关键词',
          align: 'center',
          width: 100,
          dataIndex: 'keyWord',
        },
        {
          title: '产出物形式',
          align: 'center',
          width: 120,
          dataIndex: 'productForm',
        },
        {
          title: '产品名称',
          align: 'center',
          width: 60,
          dataIndex: 'technicalProduct',
        },
        {
          title: '项目经理',
          align: 'center',
          width: 60,
          dataIndex: 'publishUserName',
        },
        {
          title: '技术等级',
          align: 'center',
          width: 60,
          dataIndex: 'techLevel',
        },
      ],
      url: {
        list: '/rad/technology/queryHostList20',
      },
      labelCol: { span: 8 },
      wrapperCol: { span: 15 },
    }
  },
  mounted() {
    this.queryParam.type=getParamValFromUrl('type')
  },
  computed: {},
  methods: {
  },
}
</script>
<style lang="less" scoped>
@import '~@assets/less/common.less';
@import '~@assets/less/hte-main.less';
@media (max-width: 1170px) {
  .page-main .container section .list-content > div.flex-num1-box {
    flex-wrap: wrap;
    > div {
      &:nth-child(1),
      &:nth-child(2) {
        width: 48%;
      }
      &:nth-child(3) {
        width: 100%;
        justify-content: flex-start;
        > span {
          margin-right: 20px;
          margin-left: 0;
        }
      }
    }
  }
  .page-main .container section .list-content > div.flex-num2-box {
    display: block;
    margin-top: 0;
  }
  
}
.bannerArea {
    position: relative;
    height:200px;
  }
</style>